<template>
    <div id='companySetting'>
        <div class="title">{{title}}</div>
        <div class="content">
          <div class="setting-title">Company Setting</div>
          <div class="setting-content">
            <Form class="my-form"  v-model="companyForm" label-width="150" label-position="left">
              <Form-item label="Company Name">
                <Input v-model="companyForm.companyName" style="width: 134px">
              </Form-item>
              <Form-item label="Company Website">
                <Input v-model="companyForm.companyWebsite" style="width: 350px">
              </Form-item>
              <Form-item label="Daydao Web Address">
                <Input v-model="companyForm.daydaoWebAddress" style="width: 267px"><span style="margin-left: 10px">.daydao.com</span>
              </Form-item>
              <Form-item label="Country" >
                <Select style="width: 134px">
                  <Option></Option>
                </Select>
              </Form-item>
              <Form-item label="Time Zone">
                <Select v-model="companyForm.timeZone" style="width: 350px">
                  <Option></Option>
                </Select>
              </Form-item>
              <Form-item label="Week Start">
                <Input v-model="companyForm.weekStart" style="width: 134px">
              </Form-item>
              <Form-item label="Date format">
                <Input v-model="companyForm.dateFormat" style="width: 350px">
              </Form-item>
              <Form-item label="Time format">
                <Input v-model="companyForm.timeFormat" style="width: 350px">
              </Form-item>
              <Form-item class="btn-group">
                <button v-touch-ripple class="default-btn">Cancel</button>
                <button  v-touch-ripple  class="default-btn active">Save</button>
              </Form-item>
            </Form>
          </div>
        </div>
    </div>
</template>

<script>
	export default {
		name: 'id',
		components: {},
		data () {
			return {
				title: '',
        companyForm:{
        }
			}
		}
	}
</script>


<style rel="stylesheet/scss" type="text/css" lang="scss" scoped>
    @import "src/assets/css/variable.scss";

    #companySetting {
      >.content{
        .setting-title{
          padding: 10px 20px;
          font-size: 20px;
          color: #325570;
          line-height: 50px;
        }
        .setting-content{
          padding: 10px 30px;
          font-size: 14px;
          color: #325570;
          .btn-group{
            margin-top: 60px;
            text-align: center;
            button{
              margin:  0 20px;
            }
          }
        }
      }
    }
</style>
